<template>
    <div class="evection-record">
        <el-table :data="evectionData" size="small">
            <el-table-column label="出差事由" prop="description" show-overflow-tooltip/>
<!--            <el-table-column label="开始日期" prop="beginDate"/>-->
<!--            <el-table-column label="结束日期" prop="endDate"/>-->
<!--            <el-table-column label="天数" prop="num" width="60px">-->
<!--                <template #default="s">-->
<!--                    {{s.row.num}}-->
<!--                </template>-->
<!--            </el-table-column>-->
            <el-table-column label="申请时间" prop="applicDate" width="160px"/>
<!--            <el-table-column label="流程状态">-->
<!--                <template #default="s">-->
<!--                    <el-tag type="warning" v-if="!s.row.end">审批中</el-tag>-->
<!--                    <el-tag type="success" v-if="s.row.end">已结束</el-tag>-->
<!--                </template>-->
<!--            </el-table-column>-->
<!--            <el-table-column label="当前节点" prop="currentNode">-->
<!--                <template #default="s">-->
<!--                    <template v-if="s.row.currentNode">-->
<!--                        {{s.row.currentNode}}-->
<!--                    </template>-->
<!--                    <template v-else>-->
<!--                        <span style="color: rgb(190 190 190);">空</span>-->
<!--                    </template>-->
<!--                </template>-->
<!--            </el-table-column>-->
<!--            <el-table-column label="处理人员">-->
<!--                <template #default="s">-->
<!--                    <template v-if="s.row.assigneeEmp">-->
<!--                        {{s.row.assigneeEmp.empName}}-->
<!--                    </template>-->
<!--                    <template v-else>-->
<!--                        <span style="color: rgb(190 190 190);">空</span>-->
<!--                    </template>-->
<!--                </template>-->
<!--            </el-table-column>-->
            <el-table-column label="审批结果" align="center" width="120px">
                <template #default="s">
                    <template v-if="s.row.end">
                        <el-tag type="danger" v-if="s.row.approved===false">未通过</el-tag>
                        <el-tag type="success" v-if="s.row.approved">已通过</el-tag>
                    </template>
                    <template v-else>
<!--                        <span style="color: rgb(190 190 190);">空</span>-->
                        <el-tag type="warning">审批中</el-tag>
                    </template>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="140px">
                <template #default="s">
                    <el-button type="default" plain size="small" @click="lookEvectionDetailClick(s.row)">查看详情</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
    <evection-apply-detail ref="evectionDetailRef"/>
    <evection-apply-detail/>
</template>

<script>
import {queryMyStartEvection} from "../../../../network/process/evection-process";
import EvectionApplyDetail from "./EvectionApplyDetail.vue";


export default {
    name: "MyEvectionRecord",
    components: {EvectionApplyDetail},
    data(){
        return{
            evectionData: []
        }
    },
    methods:{
        lookEvectionDetailClick(row){
            let detail = this.$refs.evectionDetailRef;
            detail.processInstanceId = row.processInstanceId;
            detail.visible = true;
        },
        loadMyStartEvection(){
            queryMyStartEvection(this.$store.state.loginUser.id).then(vo=>{
                this.$response.handle({
                    data: vo,
                    successFn: ()=>{
                        this.evectionData = vo.data
                    },
                    log: '出差申请记录'
                })
            })
        }
    },
    created() {
        this.loadMyStartEvection();
    }
}
</script>

<style scoped>
*{
    /*border: 1px solid red;*/
}
.evection-record{
    min-height: 99%;
    background: white;
}
</style>